<template>
	<div>
		<div class="task_list mainToBottom index_width text_center">
			<img src="/static/img/title2.png">
			<div class="company_order_sure">
				<h3 class="text_center">
					{{submitResult.companyName}}</h3>
				<ul class="company_order_sure_ul">
					<li class="f_left" style="margin-right: 100px;margin-left: 30px">总报名人数：<span class="company_zong_num">
							{{submitResult.loseApply.length+submitResult.succeeApply.length}}人</span></li>
					<li class="f_left" style="margin-right: 80px;">报名失败人数：<span>
							{{submitResult.loseApply.length}}人</span></li>
					<li class="f_left">总费用：<span class="company_zong_fei">
							{{submitResult.price}}元</span></li>
				</ul>
				<div class="company_table_success">
					<table width="100%">
						<thead>
							<tr>
								<td width="80px">姓名</td>
								<td width="190px">身份证号</td>
								<td>项目类别</td>
								<td>专业（工种）</td>
								<td>价格</td>
								<td width="200px">备注</td>
							</tr>
						</thead>
						<tbody>
							<tr v-for="(item,index) in submitResult.succeeApply" :key="index">
								<td width="80px">{{item.realName}}</td>
								<td width="190px">{{item.identity}}</td>
								<td>{{productName}}</td>
								<td>{{item.typeName}}</td>
								<td>{{item.price}}元</td>
								<td width="200px">{{item.remark}}</td>
							</tr>
						</tbody>
					</table>
				</div>
				<p style="margin: 50px 0 30px 30px;font-weight: bolder;font-size: 20px;">报名失败统计</p>
				<div class="company_table_success table_error">
					<table width="100%">
						<thead>
							<tr>
								<td>姓名</td>
								<td>身份证号</td>
								<td>项目类别</td>
								<td>专业（工种）</td>
								<td>失败原因</td>
							</tr>
						</thead>
						<tbody>
							<tr v-for="(item,index) in submitResult.loseApply" :key="index">
								<td>{{item.realName}}</td>
								<td>{{item.identity}}</td>
								<td>{{productName}}</td>
								<td>{{item.typeName}}</td>
								<td>{{item.remark}}</td>
							</tr>
						</tbody>
					</table>
				</div>
			</div>
		</div>
		<el-form>
			<el-form-item label="选择发票：" class="choose_project">
				<el-input v-model="invoiceTitle" readonly @focus="ticketDialogs = true"></el-input>
				<a type="button" class="select_class" @click="ticketDialogs = true">选择发票</a>
			</el-form-item>
		</el-form>
		<div class="company_order_btns text_center">
			<a class="company_order_next_btn" @click="goLast">上一步</a>
			<a class="company_order_next_btn" @click="merchantApplyToSubmit">去付款</a>
		</div>

		<!-- 选择发票 -->
		<el-dialog :visible.sync="ticketDialogs">
			<ticketDialog @ticketDialogBtn="ticketDialogBtns" :showBtn="1"></ticketDialog>
		</el-dialog>
	</div>
</template>

<script>
	import ticketDialog from './../../components/invoice_lists.vue'
	export default {
		props: ["submitResult", "productName"],
		data() {
			return {
				isTiPrev: 0,
				ticketDialogs: false, //选择发票
				invoiceTitle: "",
				invoiceTempId: "",
				invoiceType: 0,

			}
		},
		mounted: function() {
			this.isTiPrev = localStorage.getItem("isTiPrev");
		},
		methods: {
			ticketDialogBtns: function(data) {
				console.log(JSON.stringify(data));
				if (data == false) {
					this.ticketDialogs = false;
					return;
				}
				this.ticketDialogs = false;
				this.invoiceTitle = data.invoiceTitle;
				this.invoiceTempId = data.invoiceTempId;
				this.invoiceType = data.invoiceType;
			},
			merchantApplyToSubmit: function() {
				var that = this;
				this.common.post(this.api.merchantApplyToSubmit, {
					invoiceTempId: this.invoiceTempId,
					invoiceType: this.invoiceType
				}, function(data) {
					that.common.toPage("/home/apply/zhifubao/" + data.resultMap);
				});
			},
			goLast: function() {
				this.$emit("goPrev", '');
			}
		},
		components: {
			ticketDialog
		}
	}
</script>

<style>
</style>
